<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script th:src="@{/webjars/jquery/3.5.1/jquery.min.js}"></script>
    <script>
        $(function () {
            $("#name").blur(function () {
                var ctxPath = '[[@{/}]]';
                var url = ctxPath+"/xqz/name/"+ this.value;
                $.get(url,null,function (response) {
                    if (response.count>0){
                        $("#checkResult").css("color","purple").html("用户名不可用");
                    }else{
                        $("#checkResult").css("color","blue").html("用户名可用");
                    }
                });
            });
        });
    </script>
</head>
<body>
    <form th:action="@{/xqz}" th:object="${xqz}" method="post">
        <h1 th:if="${xqz.id == null}">新增人员信息</h1>
        <div th:if="${xqz.id != null}">
            <h1>修改信息</h1>
            <input type="hidden" th:field="*{id}">
            <input type="hidden" name="_method" value="PUT">
        </div>
        <p>
            姓名:<input type="text" th:field="*{name}">
            <span id="checkResult"></span>
        </p>
        <p>
            性别:<input type="radio" th:field="*{sex}" value="男">男
            性别:<input type="radio" th:field="*{sex}" value="女">女
        </p>
        <p>
            年龄:<input type="text" th:field="*{age}">
        </p>
        <p>
            生日:<input type="text" th:field="*{birthday}">
        </p>
        <p>
            家庭住址:<input type="text" th:field="*{home}">
        </p>
        <p>
            手机号码:<input type="text" th:field="*{telephone}">
        </p>
        <p>
            等级:
            <select th:field="*{idType}">
                <option value="">--请选择--</option>
                <option value="1">笑脸兵</option>
                <option value="2">白银</option>
                <option value="3">黄金</option>
                <option value="4">大老鹰</option>
                <option value="5">AK</option>
                <option value="6">双AK</option>
                <option value="7">大地球</option>
            </select>
        </p>
        <button>保存</button>


    </form>
</body>
</html>